<template>
	<view>
		<view class="loading-list" :hidden="!isLoading">
			<image src="/static/loading.gif" class="icon"></image>
			<text>数据加载中</text>
		</view>
        <slot name="notdata" v-if="notData">
            <view class="notdata">{{ noDatat || '暂无数据' }}</view>
        </slot>
		<view class="ispage" v-if="!isPage">{{ isPaget || '全部数据加载完' }}</view>
	</view>
</template>

<script>
export default {
	props: {
		noDatat: {
			type: String,
			default: '暂无数据'
		},
		isPaget: {
			type: String,
			default: '全部数据加载完'
		},
		notData:{
			type:Boolean,
			default:false
		},
		isPage:{
			type:Boolean,
			default:true
		},
		isLoading:{
			type:Boolean,
			default:true
		},
	},
	data() {
		return {

		}
	},
};
</script>

<style>
	
.loading-list {
    text-align: center;
    height: 50px;
    line-height: 50px;
    font-size: 0;
}

.loading-list .icon {
    width: 16px;
    height: 16px;
    vertical-align: middle;
}

.loading-list text {
    font-size: 14px;
    color: #999;
    vertical-align: middle;
    margin-left: 5px;
}

.notdata {
    text-align: center;
    /* padding: 40px 0; */
    padding: 40upx 0;
    color: #999;
	font-size: 14px;
}

.ispage {
    text-align: center;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    color: #999;
}
</style>
